import Base from '../base.js'
export default class student extends Base {
    render() {
        $('#content').html(`
        <div style="margin: 30px 10px 0 20px " id='nav'>
        <span class="layui-breadcrumb">
            <a>种猪培训班</a>
            <a>种猪一班</a>
            <a>种猪列表</a>
         </span>
         <hr/>
        </div>
        <h1  style="margin: 10px 10px 0 20px ">种猪列表</h1>
        <hr/>
        <button id='addBtn' style="margin: 10px 0px 15px 15px" class='layui-btn layui-btn-normal'>
        <i class="layui-icon layui-icon-add-1"></i>添加
        </button> 
        <table id="showDatas" lay-filter='showDatas'></table>
        `)
    }
    handle() {
        $("script[type='module']").append(`

        //绑定工具栏
        <script type="text/html" id="barDemo" >
          <a class="layui-btn layui-btn-xs" lay-event="detail">查询</a>
          <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
          <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
        </script>


        <script>
       layui.use('table', function () {
            var table = layui.table;

            table.on('tool(showDatas)', function(obj){ //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
                var data = obj.data; //获得当前行数据
                var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
                var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）
               
                if(layEvent === 'detail'){ //查看
                    window.location.hash = '#/Main/studentDetail/'+data._id
                 
                } else if(layEvent === 'del'){ //删除
                  layer.confirm('真的删除行么', function(index){
                    obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                    layer.close(index);
                    //向服务端发送删除指令
                    $.ajax({
                        type:'delete',
                        url:'/api/student/del/data._id',
                        dataType:'json',
                        success:(data)=>{
                            if(data.code==1){
                                alert(data.msg);
                                window.location.hash = '#/Main/student'
                            }
                        }
                    })
                  });
                } else if(layEvent === 'edit'){ //编辑
                    window.location.hash = '#/Main/updatastudent/'+data._id
                } 
              });

        table.render({
            elem: '#showDatas',
            url: '/api/student/page',
            request: {
                pageName: 'currentpage' //页码的参数名称，默认：page
                ,limitName: 'pagesize' //每页数据量的参数名，默认：limit
              }
            ,limit:2
            ,limits:[2,3,4]  
            ,page:true //开启分页  
            ,parseData: function (res) {
                return {
                    "code": res.status, //解析接口状态
                    "msg": res.message, //解析提示文本
                    "count": res.totalInt, //解析数据长度
                    "data": res.data //解析数据列表
                }
            },
            title: '用户数据表',
            cols: [
                [ //表头
                    {
                        field: '_id',
                        title: '编号',
                        fixed: 'left'
                    }, {
                        field: 'name',
                        title: '用户名',
                    }, {
                        field: 'gender',
                        title: '性别'
                    }, {
                        field: 'age',
                        title: '年龄',
                    }, {
                        field: 'address',
                        title: '地址',
                    }, {
                        field: 'score',
                        title: '成绩',
                    },{
                        field: 'class',
                        title: '班级',
                        templet:function(msg){
                            return msg.name
                    }
                    }, {
                        fixed: 'right',
                        title: '操作',
                        toolbar: '#barDemo'
                    }
                ]
            ]
        });
    layui.element.render('#nav')
});

        </script>

      `)

        $('#addBtn').click(() => {
            window.location.hash = '#/Main/addstudent'
        })

    }
}